import { Space, Table, Tag, Button, Spin } from 'antd';
import type { ColumnsType } from 'antd/es/table';
import React, { useEffect, useState } from 'react';
import http from '@/utils/request/index';

const columns: any = [
  {
    title: '姓名',
    dataIndex: 'name',
    key: 'key',
    align: 'center',
  },
  {
    title: '分数',
    dataIndex: 'score',
    key: 'key',
    align: 'center',
  },
  {
    title: '城市',
    dataIndex: 'address',
    key: 'key',
    align: 'center',
  },
  {
    title: '日期',
    key: 'tags',
    dataIndex: 'time',
    align: 'center',
  },
  {
    title: '操作',
    render: () => {
      return (
        <>
          <Button type="primary" danger>
            删除
          </Button>
          <Button type="primary" style={{ marginLeft: '20px' }}>
            编辑
          </Button>
        </>
      );
    },
  },
];

const App: React.FC = () => {
  let [stulist, setStulist] = useState([]);
  let [loading, setLoading] = useState(true);

  useEffect(() => {
    const getList = () => {
      setLoading(true);
      http({ url: '/stu', method: 'get' }).then((res: object) => {
        console.log(res, 'res');

        setStulist(res.data);
        setLoading(false);
      });
    };
    getList();
    return () => {};
  }, []);
  return (
    <Spin tip="加载中...." spinning={loading}>
      <Table columns={columns} dataSource={stulist} />
    </Spin>
  );
};

export default App;
